import { Page, View, Document, Text, Image } from "@react-pdf/renderer";

const ElementRenderer = ({ node, isPDF}: { node: any ,isPDF:boolean}) => {
    const convertStyles = (styles: any) => ({
        ...styles,
        fontSize: Number(styles.fontSize) || 12, // 123改12
        lineHeight: styles.lineHeight ? Number(styles.lineHeight) : undefined,
        marginTop: Number(styles.marginTop) || 0,  // 新增
        marginBottom: Number(styles.marginBottom) || 0,
    });

    if (!node) return null;

    switch (node.type) {
        case 'text':
            return <Text style={convertStyles(node.styles)}>{node.content}</Text>;
        case 'image':
            return isPDF ? (
                <Image src={node.src} style={convertStyles(node.styles)} />
            ) : (
                <img src={node.src} style={convertStyles(node.styles)} />
            );
        default:
            return (
                <View style={convertStyles(node.styles)}>
                    {node.children?.map((child: any, index: number) => (
                        <ElementRenderer key={index} node={child} />
                    ))}
                </View>
            );
    }
};

export const PosterContent = ({ metadata }: { metadata: any }) => (
    <View style={metadata.pageStyles}>
        <ElementRenderer node={metadata.content} isPDF={true} />
    </View>
);